.content{
    width: 1140px;
    margin: 0 auto;
    display: flex;
    color: inherit;
    background: var(--bg-body);
    
    .mainleft{
        flex: 1;
        width: calc(100% - 20rem - 1rem);
        padding-top: 1rem;
        padding-bottom: 3rem;
        background: var(--bg-body);
        .mainlefttop{
          padding: 16px 0;
          margin-bottom: 1rem;
          background: var(--bg-second);
          text-align: center;
          >div{
            text-align: center;
            .iconbook{
              font-size: 2.5rem;
              display: inline-block;
              color: inherit;
              font-style: normal;
              line-height: 0;
              text-align: center;
              text-transform: none;
              vertical-align: -0.125em;
              text-rendering: optimizeLegibility;
              -webkit-font-smoothing: antialiased;
              color: var(--disable-text-color);
              // background: var(--bg-body);
            }
          }
          
          div+p{
            margin-top: .5rem;
            span{
              color: var(--primary-color);
              font-size: 1.5rem;
            }
          }
          p+p{
            margin-top: .5rem;
            margin-bottom: 0;
            span{
              color: var(--primary-color);
              font-size: 1.1rem;
            }
          }
        }
        // 左图右文
        .mainmid {
          dl:hover {
            cursor: pointer;
        
            .itemtitle {
              color: #ff007d;
            }
          }
        
          dl {
            position: relative;
            width: 100%;
            padding: 0;
            border-radius: 5px;
            margin-right: 14px;
            border-radius: var(--border-radius);
            background-color: var(--bg-second);
            box-shadow: var(--box-shadow);
            overflow: hidden;
            transition: transform .3s;
            display: flex;
            flex-wrap: nowrap;
            padding: .8rem;
            margin-bottom: 1rem;
        
            dt {
              flex: 0 0 auto;
              width: 50%;
              border-radius: var(--border-radius);
              margin-right: 1rem;
              overflow: hidden;
        
              img {
                width: 100%;
              }
            }
        
            dd {
              display: flex;
              flex: 1;
              flex-direction: column;
              justify-content: space-between;
              padding: 1rem;
              overflow: hidden;
        
              .itemtitle {
                color: var(--main-text-color);
                overflow: hidden;
                font-weight: 600;
                font-size: 16px;
                line-height: 22px;
                text-overflow: ellipsis;
                white-space: nowrap;
                font-synthesis: style;
              }
        
              .itemtext {
                display: -webkit-box;
                max-width: 100%;
                margin-top: .5rem;
                color: var(--second-text-color);
                overflow: hidden;
                font-size: 14px;
                text-overflow: ellipsis;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical
              }
        
              .data {
                width: 100%;
                padding-top: .5rem;
                color: #8590a6;
                font-size: 14px;
                line-height: 20px;
              }
            }
          }
        
        }
        
    }
    .aside {
        width: 20rem;
        margin-left: 1rem;
        padding-top: 1rem;
        padding-bottom: 1rem;
        background: var(--bg-body);
        color: inherit;
      
        .sticky {
          position: sticky;
          top: 1rem;
          margin-bottom: 1rem;
        }
    }
}
.foter {
    border-top: 1px solid var(--border-color);
    color: var(--disable-text-color);
    background-color: transparent;
    display: flex;
    flex-direction: column;

  }

  .icon {
    text-align: center;
    display: inline-block;
    margin: auto;
    margin-top: 8px;
    margin-bottom: 16px;
  }

  .title {
    font-size: 10px;
    line-height: 15px;

    p {
      text-align: center;
    }
  }